<template>
  <div class="app-container">
    <div class="create-container">
      <el-form>
        <el-form-item>
          <router-link to="/issue/create">
            <el-button type="primary">发起讨论</el-button>
          </router-link>
        </el-form-item>
      </el-form>
    </div>
    <div>
      <el-table
        :data="list"
        border
        fit
        highlight-current-row
      >
        <el-table-column label="序号" min-width="30%" align="center">
          <template slot-scope="scope">
            {{ scope.$index + 1 }}
          </template>
        </el-table-column>
        <el-table-column :show-overflow-tooltip="true" label="标题" min-width="60%" align="center">
          <template slot-scope="scope">
            {{ scope.row.title }}
          </template>
        </el-table-column>
        <el-table-column label="发起人" min-width="30%" align="center">
          <template slot-scope="scope">
            {{ scope.row.reluser }}
          </template>
        </el-table-column>
        <el-table-column label="操作" min-width="30%" align="center">
          <template slot-scope="scope">
            <el-button type="primary" size="mini" @click="handleViewCurrent(scope.row.postid)">
              查看</el-button>
          </template>
        </el-table-column>
      </el-table>

      <pagination v-show="total>0" :total="total" :page.sync="listQuery.pagenum" :limit.sync="listQuery.pagesize" @pagination="fetchData" />
    </div>
  </div>
</template>

<script>
import Pagination from '@/components/Pagination'
import { getIssueList } from '@/api/issue'

export default {
  name: 'DisscussionList',
  components: { Pagination },
  data() {
    return {
      listQuery: {
        pagenum: 0,
        pagesize: 10
      },
      total: 0,
      list: null
    }
  },
  created() {
    this.fetchData()
  },
  methods: {
    fetchData() {
      getIssueList(this.listQuery).then(res => {
        if (res.code === 200) {
          this.list = res.data.list
          this.total = res.data.total
        }
      })
    },
    // 跳转至详细页面
    handleViewCurrent(postid) {
      window.localStorage.setItem('post_id', postid)
      this.$router.push('/issue/comment')
    }
  }
}
</script>

<style lang="scss" scoped>
.create-container {
  margin-left: 20px;
}
</style>
